<template>
	<view class="">
		<x-form-list 
			v-model="userAddress.name" 
			placeholder='请输入收货人姓名'
			leftIconPath="/static/icon/render.png"
		></x-form-list>
		<x-form-list
			v-model="userAddress.phone" 
			:maxlength='11'
			type='number'
			placeholder='请输入收货人电话'
			leftIconPath="/static/icon/dianhua.png"
		></x-form-list>
		<x-form-list 
			v-model="userAddress.Uaddress" 
			rightIconStatus 
			disabled
			leftIconPath="/static/icon/ditu.png"
			rightIconPath="/static/icon/dizi-item.png"
			@rightIconEvent='rightIconEvent' 
			placeholder='请选择收货地址'
		></x-form-list>
		<x-form-list
			v-model="userAddress.address" 
			placeholder='请输入详细地址'
			leftIconPath="/static/icon/xiangxidizi.png"
		></x-form-list>
		<x-form-list
			v-model="userAddress.user_note" 
			placeholder='请输入楼栋及门牌号'
			leftIconPath="/static/icon/menpai.png"
		></x-form-list>
		<view class="d-flex aling-centen jfy-sb pg-30">
			<text class="font-30">是否为默认地址</text>
			<switch :checked="userAddress.is_default" color='#FF890B' @change="switchEvent" />
		</view>
		<view class="position-flex-bottom pg-30">
			<x-button @btnClick='btnClick'></x-button>
		</view>
	</view>
</template>

<script>
	import {
		http_userAddress_save,
		http_useraddress_view
	} from '@/config/apiRouter.js'
	export default {
		data() {
			return {
				userAddress:{
					name:'',
					phone:'',
					Uaddress:'',
					address:'',
					user_note:'',
					lat:'',
					lng:'',
					is_default:1
				},
				id:'',// 地址id,修改时用
			}
		},
		onLoad(opens) {
			if(!opens.id) return
			this.id=opens.id
			// 获取地址详情
			http_useraddress_view({
				data:{id:opens.id}
			}).then(res=>{
				res=res.data
				let userAddress={
					name:res.name,
					phone:res.phone,
					Uaddress:'',
					address:res.address,
					user_note:res.user_note,
					lat:res.lat,
					lng:res.lng,
					is_default:res.is_default
				}
				if (res.province != res.city) {
					userAddress.Uaddress=res.province + res.city + res.district 
				}
				userAddress.Uaddress=res.province + res.district
				this.userAddress=userAddress
			})
		},
		methods: {
			switchEvent(e){
				if(e.detail.value){
					this.userAddress.is_default=1
					return
				}
				this.userAddress.is_default=0
			},
			// 选择收货地址
			rightIconEvent(){
				uni.chooseLocation({
				    success:(res)=>{
						let userAddress={
							Uaddress:res.address,
							address:res.name,
							lat:res.latitude,
							lng:res.longitude
						}
						this.userAddress={...this.userAddress,...userAddress}
						
				    }
				});
			},
			verification(data){
				if(!data.name){
					uni.showToast({
						title:'请输入合法的收货人姓名',
						icon:'none'
					})
					return false
				}
				if(data.phone.length<11){
					uni.showToast({
						title:'请输入合法的收货人电话',
						icon:'none'
					})
					return false
				}
				if(!data.Uaddress){
					uni.showToast({
						title:'请选择收货地址',
						icon:'none'
					})
					return false
				}
				if(!data.address){
					uni.showToast({
						title:'请输入详细地址',
						icon:'none'
					})
					return false
				}
				if(!data.user_note){
					uni.showToast({
						title:'请输入门牌号',
						icon:'none'
					})
					return false
				}
				return true
			},
			btnClick(){
				if(!this.verification(this.userAddress))return
				if(this.id){ // 修改地址
					this.userAddress.id=this.id
				}
				http_userAddress_save({
					data:this.userAddress
				}).then(res=>{
					uni.showToast({
						title:'添加成功'
					})
					setTimeout(()=>{
						// 返回上页
						this.$tool.navigateBack()
					},1000)
				})
				
			}
		}
	}
</script>

<style lang="scss" >
	page{
		height: 100vh;
	}
	#position-flex-bottom{
		position:flex;
		left: 0;
		right: 0;
		bottom: 0;
	}
</style>
